<template>
	<view class="baba">
		
		<u-row justify="center">
			<u--image radius="70" width="140" height="140" src="http://loobo.ltd:2001/cat.jpg" shape="circle"></u--image>
		</u-row>
		<view class="content">
			<view class="input">
				<u--input
					v-model="username"	
				   placeholder="用户名"
				   border="surround"
				   clearable
				 ></u--input>
			</view>
			
			<view class="input2">
				<u--input
				   @keyup.native.enter="login"
				   v-model="password"	
				   placeholder="密码"
				   border="surround"
				   clearable
				   password
				 ></u--input>
			</view>
			<view class="loginBtn">
				<u-button text="登录" @click="login" color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))"></u-button>
			</view>
			
			<!-- #ifndef MP-WEIXIN -->
			<u-row justify="end" class="zhuce">
				<navigator url="/pages/register/register" open-type="navigate">没有账号?去注册</navigator>
			</u-row>
			<!-- #endif -->
		
			
			<!-- #ifdef MP-WEIXIN -->
			<u-row justify="end" class="zhuce">
				<navigator class="zhuce" url="/pages/register/register" open-type="navigate">去注册</navigator>
			</u-row>
			<!-- #endif -->
			
			<u-loading-page :loading="loading"  loading-text="别急,先喝杯茶"></u-loading-page>
			
			<u-notify ref="uNotify" message="账号或不能为空"></u-notify>
		
		</view>
		<view >
			<u-divider text="其他登录方式"></u-divider>
			<!-- #ifdef MP-WEIXIN  -->
			<view class="icon_login">
				<u-row justify="center">
					<u-icon @click="wxLogin" name="weixin-fill" size="44" color="#2979ff"></u-icon>
				</u-row>
				
			</view>
				
			<!-- #endif -->
		</view>
		
	</view>	
</template>

<script>
	import md5 from "js-md5"
	export default {
		data(){
			return{
				username:'',
				password:'',
				loading:false
			}
		},
		methods:{
			wxLogin(){
				uni.getUserProfile({
					desc:"获取头像",
					success:(res)=>{
						
						console.log(res);
					}
				})
			},	
			login(){
				
				if(uni.$u.trim(this.username).length < 1 || uni.$u.trim(this.password).length < 1){
					
					this.$refs.uNotify.warning('账号或密码不能为空')
					return
				}
		
				
				// #ifndef MP-WEIXIN
					this.loading = true
					setTimeout(()=>{
						let data = {username:this.username,password:md5(this.password)}
						
						uni.$u.http.post('/login',data).then((res)=>{
							this.loading = false
							console.log(res.data)
							if(res.data.code !== 200){
								
								this.$refs.uNotify.error('账号或密码错误')
							}else{
								
								uni.$u.http.setConfig((config) => {
									/* config 为默认全局配置*/
									config.header= {
										token:uni.getStorageSync('token')
									}
									return config
								})
								
								uni.setStorageSync("token",res.data.token)
								uni.setStorageSync("userinfo",res.data.data)
								uni.setStorageSync("isLogin","true")
								
								this.$store.state.route = {goLogin:true}
								
								this.$store.state.userinfo = res.data.data
								
								uni.switchTab({
									url:'/pages/user/user'
								})
							}
						})
					},500)
				// #endif
				
				// #ifdef MP-WEIXIN
						uni.showLoading({
							title:'别急,先喝杯茶',
							mask:true
						})
						
						setTimeout(()=>{
							let data = {username:this.username,password:this.password}
							
							uni.$u.http.post('/login',data).then((res)=>{
								this.loading = false
								
								if(res.data.code !== 200){
									
									this.$refs.uNotify.error('账号或密码错误')
									uni.hideLoading()
								}else{
									
									
									uni.$u.http.setConfig((config) => {
										/* config 为默认全局配置*/
										config.header= {
											token:uni.getStorageSync('token')
										}
										return config
									})
									
									uni.hideLoading()
									uni.setStorageSync("token",res.data.token)
									uni.setStorageSync("userinfo",res.data.data)
									uni.setStorageSync("isLogin","true")
									
									this.$store.state.route = {goLogin:true}
									
									this.$store.state.userinfo = res.data.data
									
									
									uni.switchTab({
										url:'/pages/user/user'
									})
								}
							})
							
						},500)
							
			
					
				
				// #endif
				
			}
		},
		
		onReady(){
			
			if(this.$store.state.route.goUser === true){
				
				this.$refs.uNotify.warning('请登录!')
			}
		}
		
	}
</script>

<style scoped>
	
	.zhuce{
		color: #0882ff;
		margin-top: 30rpx;
		margin-right: 30rpx;
	}
	.input{
		height: 80rpx;
		margin: 50rpx 60rpx;
	}
	.input2{
		height: 80rpx;
		margin: 50rpx 60rpx;
		
	}
	.content{
		margin-top: 50rpx;
	}
	.loginBtn{
		margin-top: 24rpx;
		margin-left: 60rpx;
		margin-right: 60rpx;
	}
	.logo{
		margin: 0 auto;
	}
	.baba{
		margin-top: 60px;
	}
</style>

